<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="gb2312">
    <title></title>
    <link rel="stylesheet" type="text/css" href="/static/css/animate.min.css"/>
    <script src="/static/js/jquery.js"></script>

</head>
<body>
<div class="app animated" style="background-image: url(/static/img/p0.png)">

</div>
{#<script src="/static/js/switchbg.js"></script>#}

<script type="text/javascript">
    $(function () {
        switch_bg(0);
    })

    const app = document.getElementsByClassName("app")[0];
    app.style.align = "center";
    app.style.width = "100%";
    app.style.height = "900px";

    function switch_bg(num) {
        if (num > 3) {
            num = 0;
        }
        app.style.backgroundImage = "url(/static/img/p" + num + ".png)";
        app.classList.add("fadeIn", 'slow');
        setTimeout(function () {
            app.classList.remove("fadeIn", 'slow');
        }, 2000);
        num++;
        setTimeout(function () {
            switch_bg(num);
        }, 8000);
    }

</script>
</body>

</html>
